<template>
    <wl-panel setW="700" :title="title" subTitle="" :titleIcon="titleIcon">
        <template v-if="footerFlag" slot="panel_footer">
            <el-button @click="editWebM" type="primary">保存</el-button>
        </template>
        <template slot="panel_body">
          <el-form :model="formData" status-icon ref="webMForm" label-width="100px" class="webMForm demo-ruleForm">
            <wl-form-inner subTitle="基本信息">
                <template slot="inner_body">
                    <div class="wl-row">
                        <wl-form-item label="域名网址" prop="url" :itemData="formData">
                            <wl-input   slot="input" slot-scope="col" class="wl-input-item" :rawData="col.columnData" field="url" placeholder="输入域名网址"></wl-input>
                        </wl-form-item>
                        <wl-form-item label="网站名称" prop="name" :itemData="formData">
                            <wl-input  slot="input" slot-scope="col" class="wl-input-item" :rawData="col.columnData" field="name" placeholder="输入网站名称"></wl-input>
                        </wl-form-item>  
                                             
                    </div>
                    <div v-if="applyShow">
                    <div class="wl-row">
                        <wl-form-item label="申请人" :importance="false" prop="apply_name" :itemData="formData">
                            <wl-input :disabled="true"  slot="input" slot-scope="col" class="wl-input-item" :rawData="col.columnData" field="apply_name" placeholder="申请人"></wl-input>
                        </wl-form-item>
                        <wl-form-item label="申请日期" :importance="false" prop="create_date" :itemData="formData">
                            <wl-date-picker :disabled="true"  slot="input" slot-scope="col"  :rawData="col.columnData" field="create_date"  dataType="timestamp"  placeholder="申请日期"> </wl-date-picker>
                        </wl-form-item>
                    </div>
                    <div class="wl-row">
                        <wl-form-item class="wl-form-item-full-row" label="申请理由" :importance="false"  prop="reason" :itemData="formData">
                            <wl-input  :disabled="true" setW=460 slot="input" class="wl-input-item" slot-scope="col" placeholder="申请理由" :rawData="col.columnData" field="reason"></wl-input>
                        </wl-form-item>
                    </div>
                    <div class="wl-row">
                        <wl-form-item class="wl-form-item-full-row" label="网站用途" :importance="false"  prop="purpose" :itemData="formData">
                            <wl-input :disabled="true" setW=460 slot="input" class="wl-input-item" slot-scope="col" placeholder="网站用途" :rawData="col.columnData" field="purpose"></wl-input>
                        </wl-form-item>
                    </div>
                    </div>
                    <div class="wl-row">
                        <wl-form-item label="添加人" :importance="false" prop="name" :itemData="formData">
                            <wl-input :disabled="true"  slot="input" slot-scope="col" class="wl-input-item" :rawData="col.columnData.account" field="name" placeholder="添加人"></wl-input>
                        </wl-form-item>
                        <wl-form-item label="添加日期" :importance="false" prop="create_time" :itemData="formData">
                            <wl-date-picker :disabled="true"  slot="input" slot-scope="col"  :rawData="col.columnData.account" field="create_time"  dataType="timestamp"  placeholder="添加日期"> </wl-date-picker>
                        </wl-form-item>
                    </div>
                    <div class="wl-row">
                        <wl-form-item   label="登录方式" prop="login_type" :itemData="formData">
                            <wl-select slot="input" slot-scope="col" type="login_type"  @selectChange="loginChange" :disabled="!isNoOther" :isNoShow="isNoOther" :code="feature_code" :rawData="col.columnData"></wl-select>
                        </wl-form-item>
                        <!-- <wl-form-item label="网站状态" prop="web_status" :itemData="formData">
                            <wl-select slot="input" slot-scope="col" type="web_status" :code="feature_code" :rawData="col.columnData"></wl-select>
                        </wl-form-item> -->
                    </div>
                    <div class="wl-row">
                        <wl-form-item class="wl-form-item-full-row" label="备注" :importance="false"  prop="remark" :itemData="formData">
                            <wl-input setW=460 slot="input" class="wl-input-item" slot-scope="col" placeholder="输入备注" :rawData="col.columnData" field="remark"></wl-input>
                        </wl-form-item>
                    </div>
                </template>
            </wl-form-inner>
            <wl-form-inner subTitle="配置信息">
                <template v-if="isNoOther" slot="inner_btn">
                    <div  class="div-new">
                        <wl-tip-button icon="btn_xz1" btnType="" :isSmall="true" tips="新增"  @click="doConfigNew"></wl-tip-button>
                    </div>
                    <div  class="div-new">
                        <wl-tip-button icon="btn_mmcz" btnType="" :isSmall="true" tips="清空"  @click="doConfigReSet"></wl-tip-button>
                    </div>
                    <div   class="div-new">
                        <wl-tip-button icon="btn_up" btnType="" :isSmall="true" :disabled="isUp" tips="上移"  @click="configRowUp"></wl-tip-button>
                    </div>
                    <div  class="div-new">
                        <wl-tip-button icon="btn_down" btnType="" :isSmall="true" :disabled="isDown" tips="下移"  @click="configRowDown"></wl-tip-button>
                    </div>
                </template>
                <template slot="inner_body">
                    <el-table  slot="table" :row-class-name="rowClassName" :data="formData[formData.login_key+'Configs']"  @selection-change="handleSelectionChange" 
                     style="width: 100%"  max-height="270" ref="webMTable" border stripe >
                        <el-table-column type="selection" width="40"></el-table-column>
                        <el-table-column label="操作" width="170" class-name="operation_cell">
                            <template slot-scope="scope">
                                <wl-tip-button v-if="isNoOther" icon="btn_xq" tips="查看" @click="configRowEdit(scope.$index, scope.row)"></wl-tip-button>
                                <wl-tip-button v-if="isNoOther" icon="btn_sc" :isDel="true" tips="删除" @click="configRowDelete(scope.$index, scope.row)"></wl-tip-button>
                                <!-- <wl-tip-button v-if="isNoOther" icon="btn_up" tips="上移" @click="configRowUp(scope.$index, scope.row)"></wl-tip-button>
                                <wl-tip-button v-if="isNoOther" icon="btn_down" tips="下移" @click="configRowDown(scope.$index, scope.row)"></wl-tip-button> -->
                            </template>
                        </el-table-column>
                        <el-table-column prop="config_type" label="配置项">
                            <template slot-scope="scope">
                                <wl-column field="web_config_type" :rawData="scope.row.config_type"></wl-column>
                            </template>
                        </el-table-column>
                        <el-table-column  prop="index_id" label="页面ID"></el-table-column>
                        <el-table-column prop="handle_type" label="类型">
                            <template slot-scope="scope">
                                <wl-column field="handle_type" :rawData="scope.row.handle_type"></wl-column>
                            </template>
                        </el-table-column>
                    </el-table>
                </template>
            </wl-form-inner>
            <wl-form-inner  :isShow="formData.login_type !='ca'" subTitle="公共账号信息">
                <template slot="inner_btn">
                    <div  class="div-new">
                        <wl-tip-button icon="btn_xz1" btnType="" :isSmall="true" tips="新增"  @click="doAccNew"></wl-tip-button>
                    </div>
                    <div  class="div-new">
                        <wl-tip-button icon="btn_mmcz" btnType="" :isSmall="true" tips="清空"  @click="doAccountsReSet"></wl-tip-button>
                    </div>
                </template>
                <template slot="inner_body">
                    <el-table  slot="table" :row-class-name="rowClassName" :data="formData[formData.login_key+'Accounts']"  style="width: 100%"  max-height="150" border stripe >
                        <el-table-column label="操作" width="160" class-name="operation_cell">
                            <template slot-scope="scope">
                                <wl-tip-button icon="btn_xq" tips="查看" @click="accountsRowEdit(scope.$index, scope.row)"></wl-tip-button>
                                <wl-tip-button v-if="isNoChange&&isEdit" :id="'acc_check_btn' + scope.$index" icon="btn_jc" tips="检测"  :data-acc="scope.row.id" :data-loginType="formData.login_type"  :data-id="formData.id" onclick="console.log('账号检测');javaExecute.running(this.getAttribute('data-loginType'),this.getAttribute('data-id'),this.getAttribute('data-acc'))" ></wl-tip-button>
                                <wl-tip-button v-if="!isNoChange" icon="btn_jc" tips="检测" @click="alretErr" ></wl-tip-button>
                                <wl-tip-button icon="btn_sc" :isDel="true" tips="删除" @click="accountsRowDelete(scope.$index, scope.row)"></wl-tip-button>
                            </template>
                        </el-table-column>
                        <el-table-column prop="account" label="账号"></el-table-column>
                        <el-table-column prop="password" label="密码"></el-table-column>
                        <el-table-column prop="period_date" label="有效期">
                            <template slot-scope="scope">
                                <wl-column type="date" field="period_date" :rawData="scope.row"></wl-column>
                            </template>
                        </el-table-column>
                    </el-table>
                </template>
            </wl-form-inner>
            <wl-form-inner  :isShow="formData.login_type !='account'" subTitle="ca证书信息">
                <template slot="inner_btn">
                    <div  class="div-new">
                        <wl-tip-button icon="btn_xz1" btnType="" :isSmall="true" tips="新增"  @click="doCaNew"></wl-tip-button>
                    </div>
                    <div  class="div-new">
                        <wl-tip-button icon="btn_mmcz" btnType="" :isSmall="true" tips="清空"  @click="doCaReSet"></wl-tip-button>
                    </div>
                </template>
                <template slot="inner_body">
                    <el-table  slot="table" :row-class-name="rowClassName"  :data="formData[formData.login_key+'CaMsgs']" style="width: 100%"  max-height="150" border stripe >
                        <el-table-column label="操作" width="160" class-name="operation_cell">
                            <template slot-scope="scope">
                                <wl-tip-button icon="btn_xq" tips="查看" @click="caRowEdit(scope.$index, scope.row)"></wl-tip-button>
                                <wl-tip-button v-if="isNoChange&&isEdit" :id="'pin_check_btn' + scope.$index" icon="btn_jc" :data-pin="scope.row.id" :data-loginType="formData.login_type"  :data-id="formData.id" tips="检测"  onclick="console.log('ca证书检测');javaExecute.running(this.getAttribute('data-loginType'),this.getAttribute('data-id'),this.getAttribute('data-acc'))" ></wl-tip-button>
                                <wl-tip-button v-if="!isNoChange" icon="btn_jc" tips="检测" @click="alretErr" ></wl-tip-button>
                                <wl-tip-button icon="btn_sc" :isDel="true" tips="删除" @click="caRowDelete(scope.$index, scope.row)"></wl-tip-button>
                            </template>
                        </el-table-column>
                        <el-table-column prop="pin" label="PIN"></el-table-column>
                        <el-table-column prop="uown_name" label="U盾持有者"></el-table-column>
                        <el-table-column prop="period_date" label="有效期">
                            <template slot-scope="scope">
                                <wl-column type="date" field="period_date" :rawData="scope.row"></wl-column>
                            </template>
                        </el-table-column>
                    </el-table>
                </template>
            </wl-form-inner>
          </el-form>
        </template>
    </wl-panel>
</template>
<script lang="ts" src="./webM_panel.ts"></script>
<style scoped>
.disable {
  opacity: 0.5;
  pointer-events: none;
}
.sortable-ghost {
  opacity: 0.8;
  color: #fff !important;
  background: #42b983 !important;
}

.icon-star {
  margin-right: 2px;
}

.drag-handler {
  width: 20px;
  height: 20px;
  cursor: pointer;
}

.show-d {
  margin-top: 15px;
}

.row-selecr {
  background-color: blue;
}

.wl-panel {
  top: -5vh;
}

.div-new {
  width: 22px;
  height: 22px;
  padding-right: 2px;
  margin-left: 10px;
}

.div-new .svg-icon {
  vertical-align: -0.1em;
}
</style>
